import { useAppDispatch } from '@/store';
import { getFindByParentIdSync, useCmnState } from '@/store/modules/cmn';
import { Table } from 'antd';
import React, { useEffect } from 'react';
// 表格列的配置描述
const columns = [
    {
        title: '名称',// 列头显示文字
        dataIndex: 'name',// 数组中每一个元素的属性名
    },
    {
        title: '编码',
        dataIndex: 'dictCode',
        width: '12%',
    },
    {
        title: '值',
        dataIndex: 'value',
        width: '30%'
    },
    {
        title: '创建时间',
        dataIndex: 'createTime',
        width: '30%'
    },
];

const Dict: React.FC = () => {
    const dispatch = useAppDispatch();
    const {dictList} = useCmnState();
    useEffect(()=>{
        dispatch(getFindByParentIdSync(1));
    },[])
    return (
        <>
            <Table
                // 设置key
                rowKey="id"
                columns={columns}
                pagination={false}
                dataSource={dictList}
                expandable={{
                    onExpand(expanded, record){
                        //判断是否进行展开操作,且数据为空
                        if(expanded && record.children.length ===0){
                            dispatch(getFindByParentIdSync(record.id));
                        }
                    }
                }}
            />
        </>
    );
};

export default Dict;